

h2 {
    text-align: center;
    font-size: 4rem;

}

.slider-frame {
	width: 1208px;
    height: auto;
	margin:50px auto 0;
	overflow: hidden;
}

.slider-frame ul {
	display: flex;
	padding: 50;
	width: 400%;
	
	animation: slide 30s infinite alternate ease-in-out;
}

.slider-frame li {
	width: 100%;
	list-style: none;
}

.slider-frame img {
	width: 100%;
	padding: 20px;
}

@keyframes slide {
	0% {margin-left: 0;}
	20% {margin-left: 0;}
	
	25% {margin-left: -100%;}
	45% {margin-left: -100%;}
	
	50% {margin-left: -200%;}
	70% {margin-left: -200%;}
	
	75% {margin-left: -300%;}
	100% {margin-left: -300%;}

	
}


@media screen and (max-width: 1200px){
	
	.slider-frame {
		width: 850px;
		
	}
}

@media screen and (max-width: 1000px){
	
	.slider-frame {
		width: 850px;
		
	}
}


@media screen and (max-width: 900px){
	
	.slider-frame {
		width: 650px;
		
	}
}
@media screen and (max-width: 800px){
	
	.slider-frame {
		width: 600px;
		
	}
}
@media screen and (max-width: 700px){
	
	.slider-frame {
		width: 550px;
		
	}
}


@media screen and (max-width: 550px){
	
	.slider-frame {
		width: 500px;
		
	}
}
@media screen and (max-width: 414px){
	
	.slider-frame {
		width: 350px;
		
	}
}


@media screen and (max-width: 360px){
	
	.slider-frame {
		width: 320px;
		
	}
}